<template>
	<view>
		<view class="row">
			<h3>您已通过验证</h3>
			<p>请输入您想修改的账号进行修改</p>
		</view>
		<view class="row">
			<view class="username">
				新账号名
				 <u--input
				    placeholder="请输入新账号"
				    border="surround"
				    v-model="username"
					clearable
					focus
					:disabled="over"
				  ></u--input>
			</view>
			<u-button  :disabled="over||username.length<2" size="normal" type="primary" text="确定" class="button" @click="submitUsername"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username:"newUsername",
				over:false
			}
		},
		methods: {
			submitUsername(){
				uni.showLoading({
					title:"修改中..."
				})
				const username=this.username
				if(username.length>2){
					if(getCurrentPages().length!==1){
						setTimeout(()=>{
							this.over=true
							this.$store.commit("login",Object.assign(this.userInfo,{username}))
							uni.showToast({
								title:"已修改",
								mask:true,
								icon:""
							})
							setTimeout(()=>{
								uni.navigateBack({
									url:"/pages/tabBar/user/userInfo/username",
								})
							},500)
						},0)
					}else{
						uni.$u.toast('验证失败')
					}
				}
			}
		}
	}
</script>

<style scoped>
.page{
	padding: 20% 1em 0;
}
.row{
	text-align: center;
	margin-top: 2em;
}
.username{
	font-size: 12px;
	display: flex;
	flex-direction: row;
	align-items: center;
	
}
.button{
}
</style>
